<template>
  <div>
     <div >
        <!-- 事件对象e可以直接在fn当中接收然后使用 -->
        <!-- <button @click="fn">按钮</button> -->
        <!-- 但是如果传参了，那就需要带了 --> 
        <!-- <button @click="fn1(3,$event)">按钮</button> -->

        <!-- 阻止a标签的跳转 -->

        <!-- <a href="javascript:;">删除</a> -->

        <!-- 阻止表单的默认提交事件 -->
        <!-- <form @submit="fn3">

            <input type="text">

            <button>提交</button>

        </form> -->
        <!-- 事件修饰符：vue提供事件修饰符，可以快速阻止默认行为或阻止冒泡 -->

        <!-- <a href="" @click.prevent.stop="fn2">注册</a> -->

        <!-- <form action="http://www.itcast.cn" >

            <input type="text">

            <button @click.prevent.stop = 'fn'>提交</button>

        </form> -->

        <!-- 判断用户是否按了回车 -->
        <!-- <input type="text" @keyup.enter="keyUp"> -->
        <!-- <input type="text" @keyup.esc="keyUp"> -->
        <input type="text" @keyup="keyUp">

     </div>
   </div>
</template>
 
<script>
export default {
  data() {
    return {};
  },
  methods:{
    fn(e) {
        console.log(e);
    },

    fn1(num,e) {
        console.log(e);
    },

    fn2() {
        console.log(1);
    },

    fn3(e) {
        e.preventDefault()
    },

    father() {
        console.log('我是父元素触发的事件');
    },

    keyUp() {
        console.log('内容');
    }
  }
};
</script>

<style scoped>
     
</style>